<template>
  <x-border ref="xBorder" icon="flaticon-settings" class="admin-autoconfig-list">
    <x-table :type="type" v-if="type" :isShowPage="false" ref="xTable" @afterTableLoad="afterTableLoad"></x-table>
  </x-border>
</template>

<script>
  import './var.scss'
  import './styles'
  import ala from 'ala'
  export default {
    data () {
      return {
        type: null,
        firstLoad: true // 首次加载
      }
    },
    props: {
      widget: {}
    },
    mounted () {
      this.init()
    },
    methods: {
      async init () {
        this.type = this.$ala.urlType()
        if (!this.type) {
          this.$ala.error('网址输入不正确，autoconfig请输入相关的key', 'danger')
        }
        this.firstLoad = false
      },
      // 表格加载完成事件
      afterTableLoad (dataResult) {
        this.$nextTick(() => {
          this.$refs.xBorder.init(dataResult.border)
        })
      },
      watchRoute (val) {
        if (this.firstLoad === true) {
          return // 第一次加载，不监听路由，防止二次触发
        }
        if (this.$ala.router().path !== '/Admin/AutoConfig/List') {
          return // 调转到其他页面时，不执行
        }
        this.init()
        this.$nextTick(() => {
          this.$refs.xTable.init(this.type)
        })
      }
    },
    watch: {
      $route: 'watchRoute'
    }
  }
</script>
<style rel="stylesheet/scss" lang="scss">
  @import "./var.scss";
</style>
